<div class="container col-thin" ng-init="expId = '<{$data.exp_id}>'" ng-controller="resumeEditController">
    <div class="row">
        <div class="col-xs-12 col-panel-profile">
            <h5>编辑描述/附件</h5>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12 input-modify">
            <h6 class="text-tips">项目名称/公司</h6>
            <p ng-show="inputProjName == 0" class="text-name" ng-click="clearInputs(); inputProjName = 1">{{ projName }}</p>
            <input type="text" ng-hide="inputProjName == 0" id="inputProjName" class="form-control input-modify"
                   ng-init="projName = '<{$data.project_name}>'" ng-model="projName" ng-change="submitProjName()"/>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12 input-modify">
            <h6 class="text-tips">工作职责</h6>
            <p ng-show="inputRole == 0" class="text-name" ng-click="clearInputs(); inputRole = 1">{{ role }}</p>
            <input type="text" ng-hide="inputRole == 0" id="inputRole" class="form-control input-modify"
                   ng-init="role = '<{$data.role}>'" ng-model="role" ng-change="submitRole()"/>

        </div>
    </div>

    <div class="row">
        <div class="col-xs-12 form-group">
            <h6 class="text-tips">详细描述</h6>
            <textarea id="inputDesc" rows="4" cols="50" class="form-control"
                      ng-init="desc = '<{$data.description}>'" ng-model="desc"
                      ng-change="submitDesc()" placeholder="可描述项目重要人物的参与，如明星等；
项目经历了一些比较重大的事项；
自己在此项目中的收获等"></textarea>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12 form-group">
            <h6 class="text-tips">作品链接</h6>
            <input type="text" id="inputUrl" class="form-control"
                   ng-init="url = '<{$data.url}>'" ng-model="url" ng-change="submitUrl()"
                   placeholder="把作品链接复制到此即可">
        </div>
    </div>

    <div class="row" ng-init="getExpAttach()">
        <div class="col-xs-12">
            <h6 class="text-tips">附件（可上传作品截图或工作照）</h6>
            <ul class="ul-attachment">
                <li ng-repeat="image in attach">
                    <a href="javascript:;" class="link-img" tabindex="0"  data-placement="top" data-toggle="popover"
                       title="" data-content="<a href='#' onclick='scaleAttach({{ $index }})'>放大</a>
                       <br/><a href='#' onclick='javascript: angular.element(this).scope().delAttach({{ $index }})'>删除</a>">
                        <img ng-src="__UPLOAD__/{{ image.image_url }}" width="60px" height="60px"/>
                    </a>
                </li>
                <li id="liAdd">
                    <iframe name="iframebox" src="" style="display:none" ></iframe>
                    <form name="uploadForm" class="form-upload" action="<{:U('Upload/photoExp')}>"
                          target="iframebox" enctype="multipart/form-data" method="post" >
                        <input type="file" name="avatar" class="input-imgfile"
                               onchange="uploadImgCheck();">
                        <input type="hidden" name="exp_id" value="<{$data.exp_id}>">
                    </form>
                    <img src="__MOBILE__/img/btn_create.png" width="60px"/>
                </li>
            </ul>
        </div>
    </div>

    <!-- Modal Image Scaler -->
    <div class="modal fade" id="scaleModal" tabindex="-1" role="dialog" aria-labelledby="scaleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                </div>
                <div class="modal-body center">
                    <a href="javascript:;" data-dismiss="modal">
                        <img ng-src="__UPLOAD__/{{ scaleTarget }}" width="100%">
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!--<button type="button" class="btn btn-lg btn-danger" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?">点我弹出/隐藏弹出框</button>-->
    <script>
        function uploadImgCheck() {
            var exp = /.jpg$|.jpeg$|.gif$|.png$|.bmp$/;
            var file = document.uploadForm.avatar.files[0];
            if (file.size > 5 * 1024 * 1024) {
                alert("上传图片不能超过5M");
                return;
            }
            if (!exp.exec(file.type)) {
                alert("图片格式不正确");
                return;
            }
            document.uploadForm.submit();
        }

        // Update from server script
        function updateImg(res) {
            var appElement = document.querySelector('[ng-controller=resumeEditController]');
            if (res.msg != null) {
                angular.element(appElement).scope().
                        getExpAttach();
            } else if (res.err != null) {
                alert(res.err);
            }
        }

        function scaleAttach(imageIndex) {
            var appElement = document.querySelector('[ng-controller=resumeEditController]');
            $('#scaleModal').modal('show');
            angular.element(appElement).scope().
                    scaleAttach(imageIndex);
        }

        $(function() {
            $('body').popover({
                selector : '.link-img',
                html : 'true',
                template : '<div class="popover popover-img" role="tooltip"><h3 class="popover-title"></h3><div class="popover-content"></div></div>',
                direction: 'top',
                trigger : 'focus'
            });
        });
    </script>
</div>